E-commerce avec Seblod

14 vues
06 octobre 2014
Cyril
seblodbyoctopoosinline

 

Salut à tous!

La grande question

Une autre question récurrente lors des formations SEBLOD est "oui mais avec l'e-commerce on fait comment?". Sachez donc que Seblod n'est pas juste compatible avec l'e-commerce mais surtout qu'il permet des expériences e-commerce originales et personnalisées qu'aucune autre solution de pure boutique en ligne ne peut fournir.
 Le but de ce billet est de présenter une solution simple pour une solution d'e-commerce 100% native Joomla et seblod.
Cette solution utilise le composant J2STORE pour la gestion du panier, du tunnel de paiement, des options de livraison, de la facturation et de toutes les fonctions inhérentes à une solution d'e-commerce.

Avec cette solution n'importe quel contenu Seblod (qui n'est qu'un article Joomla étendu) peut devenir un produit d'e-commerce.

La nouvelle solution avec J2store 3.x et SEBLOD 3.x

 Avec la dernière version de J2store (3.x) existe un plugin de champ SEBLOD (gratuit) pour que le montage d'une solution e-commerce avec SEBLOD soit vraiment très simple et très rapide. En effet il suffit maintenant d'installer le champ (téléchargeable sur le site de J2store) et de suivre ce tutoriel pour l'intégration ecommerce avec SEBLOD. L'idée est qu'il faut juste créer un champ de type j2store et placer ce champ dans la vue formulaire pour saisir les infos e-commerce relatives au produit mais aussi dans la vue contenu (ou dans une vue liste) pour afficher le bouton 'ajouter au panier'. C'est aussi simple que cela!

Il faut au préalable configurer Jstore (menu componsants/ j2store/ options) de telle façon qu'il interprete la balise n'importe où dans le vue contenu
Ecommerce j2store config

 

Il faut ensuite ajouter un champ de type J2store dans la vue formulaire du type de contenu (ici un 'product'):

j2store field plugin

Pour obtenir ce type d'interface dans le gestionnaire d'articles du backoffice:

j2store seblod article form

 Il faut ensuite placer ce même champ J2store dans la vue contenu du produit:

seblod j2store content

Pour obtenir le résultat suivant dans le vue détail du produit sur le site:

Ecommerce front

Et ensuite ajouter, par exemple, ce même champ dans les vues listes (un catalogue produit par exemple) pour que le bouton 'ajouter au panier' apparaisse dans la liste:

j2store list

La solution sous Joomla 2.5 et J2store 2.x

 Nous listons ici l'ancienne solution que nous avions publié en 2014 qui déjà permettait une intégration ecommerce dans SEBLOD mais comme on peut le voir n'était pas aussi rapide à mettre en oeuvre:

Création des champs nécessaires 

Avec les template d'édition d'articles standards, J2store propose un volet sur la droite pour remplir les champs j2store associés à l'article.
Ecommerce j2store

Le but est donc de recréer ces champs dans le template SEBLOD. Au minimum nous avons besoin de 2 champs

Ecommerce fields

Ces deux champs doivent absolument posséder ces stockages précis:

Ecommerce itemprice field

Ecommerce product enabled field

Le premier champ contient le prix de l'article, le second est un booléen pour indiquer si oui ou non un bouton 'ajouter au panier' sera ajouté dans les vues contenu de l'article.

Ce qui donne dans l'édition du contenu:
Ecommerce admin
On peut procéder de la même manière sur les autres champs J2store qui sont stockés en JSON dans le champ attribs de l'article.

Affichage du bouton 'ajouter au panier

Pour que ce bouton apparaisse il suffit qu'une balise J2store soit présente dans la vue contenu. Cette balise est de la forme
{j2storecart ID}
Avec ID valant l'ID du contenu (= article joomla).


Il faut ensuite ajouter un champ 'ajout_panier' qui va contenir cette balise.
On ajoute donc les champs suivants dans cette vue contenu:

Ecommerce content view

Le champ code contient les lignes suivantes:

if ($fields['product_enabled']->value)
$fields['ajout_panier']->value="{j2storecart ".$fields['art_id']->value."}";

Le resultat en front est un contenu avec le champ 'ajout panier' qui permet l'achat de ce contenu avec la gestion du panier et du tunnel de paiement:


Ce qui donne en vue contenu:
Ecommerce front



 Affichage dans une liste Seblod

On peut tout autant afficher le bouton 'ajout au panier' dans une liste Seblod:
Ecommerce liste


Pour cela il faut configurer la liste comme suit:
Ecommerce liste produits

Super BreadCrumb for Joomla 1.5 1.6 & 1.7
Pulsar présente le CMS Joomla! au club STARINUX
Pulsar et Joomla pour les sites évolués au JoomlaDay 2014
Joomla! fête ses 10 ans!
Pulsar présente le projet pour la Sorbonne au JoomlaDay!
Pourquoi nous avons ajouté WordPress à notre offre
Joomla et les CCK
Pulsar primé pour le site de la Sorbonne
Sites multi langues mobiles avec Joomla et Seblod
Gestion Electronique de Documents sur mesure
3 nouvelles extensions Joomla! de Pulsar dans la JED
Personnalisation du backoffice de Joomla!
Ajouter Cufon à votre site Joomla!:
l'AFUJ exposant au salon Open Source Summit 2015
Correctif de Pulsar dans le routeur de Joomla
Override joomla du template 'category' lié à un menu
Joomla! meilleur CMS PHP Open Source
Pulsar, sponsor OR du JoomlaDay 2017
SOBI Pro: le menu principal ne s'affiche pas
Pulsar sponsor OR du JoomlaBusiness 2015
Import shipping pour hikashop
Critère de correspondance pour la recherche SEBLOD
JCEmediabox et css js compress
Elections 2016 ... le CMS Joomla! encore
Fenêtre coulissante avec Joomla et Seblod
Workflow et formulaires faciles avec Joomla! et Seblod 3/4
Ajouter une icône d'édition dans une liste SEBLOD
Job board intégré à votre site Joomla!
Pulsar gagne l'appel d'offre de la Sorbonne
Comparaison des CCKs pour Joomla!
Une agence web Joomla! au Drupagora
Developpements pour la Bibliotheque Mazarine
Nouveau site de Pulsar avec Seblod!
L'agence Pulsar sponsorise le JoomlaDay 2015
Comprendre les droits et niveaux d'accès de Joomla!
Astuces PHP lazy load sous joomla seblod warp
Advanced module manager et page d'accueil
Pulsar au JoomlaDay 2014: Chaine de production
Entrées grisées avec la mention [extrait] dans DOCMAN
Les solutions multi sites avec Joomla!
JoomlaDay 2015: Pulsar y était!
Un nouveau routeur pour Joomla!
Chargement Joomla avec Mootools de Google
Workflows généralisés avec Joomla! et Seblod (partie 4)
Pulsar sponsor du Joomladay
Pulsar, le JoomlaDay et Israël
GED Open Source simple pour les PME
Multisites, multilangues et multidevices pour la SORBONNE
Joomla meilleur cms open source 2011
Joomla! présent au salon AGORA CMS 2016
Comprendre le stockage des données avec SEBLOD
Workflow Joomla! évolué avec Seblod 2/4
Plugin de cache Joomla : les images ne s'affichent pas
Joomla! à nouveau élu meilleur CMS 2017
Ajouter le bouton DOCLINK avec Jevents et SobiPro
Les nouveautés de Joomla! 4
SEBLOD: supprimer un script à moindre coût
Workflows évolués pour Joomla! avec Seblod 1/4
Développement multi sites avec Joomla et Seblod
SEBLOD et J2store au JoomlaDay Israël 2017
sh404SEF: URLs n'apparaissent pas
Pulsar présente le JoomlaBusiness à l'AFUP
Paramètres hikashop des items de menu
Astuce: suppression des éléments Seblod
Pulsar developpe la passerelle Joomla LUCENE SOLR
Monétisez votre workflow avec Joomla!
Pulsar certifie ses formateurs Joomla!
Référencement naturel, cocons sémantiques et Joomla!
Pulsar forme au CCK SEBLOD pour Joomla!
Plugin merge css/js pour Joomla
Edition front end avec Hikashop et Virtuemart
Chasse aux bugs des templates Warp
Virtuemart: flèches quantité ne fonctionnent pas
Optimisation et vitesse de votre site Joomla!
Extensions Joomla: accessibilité, menu vertical et réseaux sociaux
Les avantages de Joomla! face à Drupal
com_search joomla 2.5 recherche sans accents
Pulsar au JoomlaDay Israel 2016
Pulsar présente le job board du nouveau site web Dynamique Emploi
Sommaire automatique pour Joomla
CMS Day: Joomla pour les projets du secteur public
Soirée CMS open-source en PHP
Projets multi langues et multi sites avec Seblod
Indiegogo: contrôle de version avancé avec SEBLOD
Pulsar présente JOOMLA à AGORA CMS
Transformer un article en contenu SEBLOD
Quelles extensions choisir pour son site joomla ?
Les solutions e-commerce avec Joomla!
Joomla 4 : professionnalisation et performance
JoomlaDay 2015: Joomla! pour les applis pro
Pulsar présente son expertise SEBLOD au JoomlaDay 2013